Para hacerlo nos situaremos en Plantilla/Edicción HTML buscaremos donde dice #sidebar-wrapper { y añadiremos: border-left: 1px solid #000000;
Quedaría algo así:
#sidebar-wrapper {
width: 220px;
float: right;
border-left: 1px solid #000000;
El valor (1px) podemos aumentarlo o disminuirlo según el grosor deseado.
Para el color bastaría cambiar (#000000) por el color escogido pero no olvidéis cerrar con (;)
Rizo rizado JmpaSrgc.
¡Rizo rizado! ¡Sí, señora!
Pues me pondré manos a la obra en cuanto tenga un ratito.
Gracias por acordarte ;)
Un saludo
¡Jaja! Ya veo que lo has aplicado en tu blog, ¡y queda chulísimo!
Mmmm... aparece muy junto al texto de la "sidebar" y de "main" :'(
hola gem@!!bueno intente comunicarme con Federico pero no me responde :s ... en fin te agradeceria que me pudieras ayudar ... (yo era el que tenia el porblema de las entradas con [+/-])... Tambien tengo dificultaes con algunos scripts como el de "el titulo en movimiento" que se ve en el navegador... Muchasss gracias por respondermee!!!!!!
Tu blog se veia mejor sin esta línea, en mi opinión, nada más asi en gris la sidebar, se veia más elegante y menos cargado. Pero como a ti te guste.
JmpaSrgc es increíble, tenía delante mía la forma de hacerlo y no me había dado cuenta jajaja
No está mal el problema es que me cansa ver lo mismo siempre, veremos lo que dura ahí :D
Hay que solucionar eso, si t evale de referencia yo tengo en #main-wrapper y #sidebar-wrapper el mismo valor de:
margin: 0 0 1px 0;
padding: 5px 5px 5px 22px;
MaTuT el script de texto en el navegador no es visible en Explorer puede que ese sea el problema ¿te pasa también con otro navegador?
Lo de las entradas era aplicarlo tal y como yo lo tengo es así?
Hola Jaime, estoy probando, como verás hay opiniones para todos los gustos lo que para unos el color del blog es triste para otros es elegante, y la verdad no me gusta recargarlo de colores...
Por cierto.. no dejas enlace a tu blog cuando comentas ¿te diste cuenta?
Gracias por comentar..:)
Hola gem@ si lo de las entradas es asi coomo lo tenes vos con el [+/-] ...con lo q respecta al titulo del blog en movimiento visto con el Explorador, si se ve con el IE ya lo vi en varias paginas mismo en la tuya cuando lo aplicastes...
Hola Gem@, aprovechando que estas realizando cambios, te he hecho esta imagen de cabecera por si quieres cambiarla:
http://img516.imageshack.us/img516/9157/gemams3.jpg
Espero que te guste!
Hola gema
sabes que buscando una línea de separación horizontal para la sidebar, me encontré con esto que hice aquí: http://cazandolanitas.blogspot.com me gustó más que una línea, aunque derrepente aburre cuando está muy cerca un mono de otro, pero me pareció interesante mostrartelo.
lo bueno es que puedo cambiarlo cuando quiera.
Saludos paranormales.
Hola Animita tu efecto se trata de un gif (una imagen animada)
Esa parte de la sidebar da mucho de si, puedes separar las secciones con barras decorativas, líneas, botones, y un sin fin de imágenes.
La separación de mis secciones por ejemplo es una imagen, un texto aplicado como imagen :)
Hola Gema
Y como puedo poner una barra?, porque el gif queda detrás del título y la barra debe quedar arriba para separar.
Saludos.
Matut me he estado fijando y tu plantilla es de bloganweb. Es una plantilla de Wordpress adaptada para Blogger.
Quien mejor puede orientarte sin temor a equivocarse es Francisco el autor de esa plantilla.
De todas formas intentando ayudarte he buscado la página donde Francisco da instrucciones sobre esa misma plantilla.
Suerte ;)
JoXu !muchas gracias amigo¡ has dedicado tu tiempo para crear este logo y te lo agradezco mucho.
Tengo otro creado por mi pero aún no he podido probar como queda, tendré en cuenta este también para más adelante.
Gracias, mil gracias :)
Animita La puedes poner en Añadir un elemento de página como imagen, arrastrando la etiqueta según donde quieres que salga.
O en la plantilla/edicción html en
/* Sidebar en lugar de la que tienes.
Nada, no consigo que me quede bien. Al tener 3 columnas, en la de la izquierda la linea de separación me queda a la izquierda de la sidebar y no a la derecha para separarla de la main. Al mismo tiempo tampoco he conseguido que quede a la misma distancia de las dos columnas a separar, quedando siempre pegada a una de las dos.
Lo dejaremos para otro momento.
Esta vez no pude "rizar el rizo" :(
Un decepcionado saludo,
JmpaSrgc
JmpaSrgc Haría efecto si le añades el atributo right (derecha) en vez de righ (para la de la izquierda)
¿has probado en añadirla en el main? de esa forma queda a la derecha de la sidebar izquierda.
¿Qué tal Gem@?
En primer lugar enhorabuena por tu blog, que me parece muy útil y surtido. Te visito a menudo pero es la primera vez que comento.
Y es que tengo un problema con esta línea de separación: a pesar de cambiar el valor, no me cambia el color, siempre me sale el mismo que tú tienes puesto. ¿Y esto por qué?
Un saludo, gracias.
Mr Prado el color debes cambiarlo en solid #000000; lo que está en negrita es el color.
Aquí tienes diferentes tablas de colores donde escoger:
tabla-de-colores.
Ok Gem@ gracias. Debía estar metiendo un código equivocado, pero lo estaba haciendo bien. También he cambiado a 1px de ancho ya que lo tenía en 2, pero eso no debería ser un problema.
En fín, gracias.
Gracias por tu comentario.
Claro que ha quedado bien, con tu inestimable ayuda :)
Gracias Mr Prado ;)
Hola gemma,un saludo una vez mas y una felicitacion por tu post,ni siquiera habia pensado en una linea de separacion o es mas,ni le daba una minima idea,la verdad que e probado y queda excelente,pero,en otro blog que tengo me a sido imposible visualizarla entera,curiosamente se ve a trozos creeme y no e conseguido dejarla intacta o visualmente bien.
No osbtante agradezco lo k para mi a sido una idea,tu esmero una vez mas por enseñar cosas muy utiles.
No quiero despedirme sin decirte antes que aplique tu idea al poco tiempo de exponer el post,y hoy me e decidido a darte mis gracias por el preciado contenido.
mi blog principal ya sabes cual es o eso espero y mi blog en cuestion que te comento es el siguiente por si deseas echarle un vistazo.
Una vez mas gemma,muchas gracias de verdad.Un saludo muy cordial del txoky.
Por dios,perdon por el despiste de exponer mi blog,
http://pikassotheboss.blogspot.com/
Ese es el bog que no habia puesto,
Saludos.
El TXOKY muchas gracias por tus comentarios siempre amables.
Si sigues queriendo añadir esa línea que separa el main de la sidebar dime como se llama tu plantilla para averiguar por qué no se visualiza entera ;)
Bueno gemma,la verdad que para no desperdiciar tu valiosso tiempo en un error confirmado,te confirmo que si e podido finalmente visualizar la linea gracias al cambio de la imagen del blog,no queriendo hacerte perder un tiempo valioso para otros muchos,opte primero por usar tal y como me comentaste la plantilla original y comprobar mi error al ver la visualizacion correctamente con su linea añadida,segui el procedimiento con la plantilla modificada por mi parte,viendo el error inicial que te comente,no dude en cambiar la imagen del fondo y visualizarla una vez mas,correspondiendose tal a mi innegable fallo.
En resumen,que meti la gamba con el fondo y por eso no se veia la linea de separacion.
Asi que una vez mas agradezco tu molestia al hecho al que no procedi correctamente en la modificacion de la plantilla.
Aun asi antes de darte las gracias te paso el nombre de la plantilla en cuestion Plantilla Blogy-Acuerdo.
Una vez mas gracias gemma por tu humilde ayuda.
El TXOKY hiciste muy bien, pero no por evitar buscar tu problema sino porque es de mucha utilidad utilizar siempre un blog para pruebas.
Yo tengo... 4 ó 5 :D depende las plantillas que lleve en danza y si no fuera por ellos no sé que haría.
Me alegra que lo resolvieras es cierto que tengo muchas preguntas pendientes pero también lo es que intento dar la solución a todas.
Saludos cordiales y gracias por el detalle de comentármelo pienso que tu sabías que antes o después buscaría tu plantilla ;)
Excelente el post, pude agregar las barras divisorias verticales sin problemas.
Muy bueno el blog, felicitaciones!!
Gracias Blus
Hola gem@ disculpa mi ingnorancia pero no logro hacer ke la linea de separacion kede muy pegado al sidebar,por favor ayudame:(
Disculpa por el anterior comentario que no lo escribi bien.El problema es que la linea de separacion me queda muy pegada al sidebar y no logro separarla.
Neowave en lugar de añadirla en sidebar-wrapper añádela en main-wrapper de esta forma:
border-right: 5px solid #ff9900; ;)
Me gustaría poder poner una línea como esta, pero en las entradas,
algo así: http://img44.xooimage.com/files/4/0/3/dibujo-13ae88f.png
mi blog es: http://sabiosdelpc.blogspot.com/
y mi mail pcsabios@ gmail.com
Desde ya muchas gracias. Saludos
Hola, como estás?
Mi pregunta es, ¿como coloco una linea o separador entre los gadgets de mi blog?; el mismo es http://www.elio-cienciaytecno.blogspot.com/
Gracias por tu tiempo y atencion.
yz SabiosDelPc eso son comillas o Blockquotes, puedes ver com ohacerlo en la siguiente url:
http://gemablog-.blogspot.com/2008/12/blockquotes-bien-lindos-con-css.html
yz Eduardo ¿para incluir el contenido de tu sidebar lo añades todo en un mismo gadget desde la plantilla de diseñ?
Te lo pregunto porque no veo en tu plantilla los estilos para los widgets que es donde puedes añadir la línea, sería algo así:
.sidebar .widget {
border-bottom:1px solid #111;
}
Como te decía si los añades todos en un mismo gadget puedes añadir la línea separadora añadiendo <hr> (dentro del gadget separando los contenidos)
si deseas dejar separación entre la línea y el contenido puedes añadir un salto de línea con <br>
Pues no hay blog Ali ¿qué pasó? .S
Hola! Me gustó este truco y ya lo implementé en mi blog. Mi pregunta es si la línea separadora se puede agrandar hacia abajo de modo que separe TODA la columna principal de la sidebar. Lo intenté poniéndola en main, pero la línea no la puedo mover.
Por cierto, main-wrapper y sidebar-wrapper no salen en mi plantilla, así que la línea la tuve que poner en .sidebar
Mi blog es http://himitsunoyoru.blogspot.com/
Eso ocurre porque al estaar añadida a la sidebar la línea termina donde ella, para evitarlo puesdes ponerla en el main buscando los siguientes estilos:
.main-inner .column-center-inner {
padding: 10px 0;
border-right: 1px solid #ffffff;
}
Gracias por responder tan luego, hice lo que escribiste y se solucionó el problemas =) ¡Muchas gracias!
Hola, Gema.
Estoy intentando poner una línea discontínua que separe las entradas de la sidebar. Mi blog tiene dos columnas en la sidebar y he podido poner esta línea entre ambas, pero no la que te comento.
Esto es lo que tengo en la parte de las columnas en el HTML:
.main-inner .columns {
padding-left: $(main.column.left.width);
padding-right: $(main.column.right.width);
}
.main-inner .fauxcolumn-center-outer {
left: $(main.column.left.width);
right: $(main.column.right.width);
/* IE6 does not respect left and right together */
_width: expression(this.parentNode.offsetWidth -
parseInt("$(main.column.left.width)") -
parseInt("$(main.column.right.width)") + 'px');
}
.main-inner .fauxcolumn-left-outer {
width: $(main.column.left.width);
}
.main-inner .fauxcolumn-right-outer {
width: $(main.column.right.width);
}
.main-inner .column-left-outer {
width: $(main.column.left.width);
right: 100%;
margin-left: -$(main.column.left.width);
}
.main-inner .column-right-outer {
width: $(main.column.right.width);
margin-right: -$(main.column.right.width);
}
Y quiero poner una línea verde discontínua como las que puedes ver aquí: www.oculimundienclase.blogspot.com
La plantilla es una nueva de Blogger, modificada. Te agradecería mucho que me pudieras ayudar.
Un saludo.
Hay una parte que dice algo así como...
table.section-columns td.first.columns-cell {
border-left: medium none;
}
Ese medium none es lo que puedes eliminar y añadir el borde tal como en la otra columna :)
¡Gracias, Gema! Ya está la línea como quería :) Las líneas que me has indicado no estaban escritas en la sección de *Columns. Fantástico. ¡Muchas gracias!
De nada Negrevernis ;)
Nota: solo los miembros de este blog pueden publicar comentarios.